
$mainColor:#ebce86;
$mainColor2:#baaa83;
$blackColor:#333;
$whiteColor:#999;
@import "./mobileui.scss";

@font-face {font-family: "CNE";
  src: url('../font/iconfont.eot'); /* IE9*/
  src: url('../font/iconfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../font/iconfont.woff') format('woff'), /* chrome, firefox */
  url('../font/iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('../font/iconfont.svg#CNE') format('svg'); /* iOS 4.1- */
}

.icon-gua {
  font-family:"CNE" !important;
  font-size:16px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}



body{background: #333;}
body,ul,li{margin:0;padding: 0;list-style: none;}
.body{background: url(../img/bg.jpg) #666; background-size:100vw auto;width:100vw;height:100vh;overflow: auto;box-sizing: border-box;padding-top:11vmin;}



/*---------------首页 start----------------*/
.index-header{
  background: $mainColor;padding-bottom:2vw;text-align: center;
  .index-header-icon{text-align: center;font-size:7rem; letter-spacing: 5vw;}
  .index-header-text{font-size: 0.85rem; color:#977f44;text-align: justify;padding: 1vw 5vw 0 5vw;}
}
.index-boot{
  padding: 1vw 3vw 1vw 3.5vw;border-bottom: solid 1px rgba(51,51,51,0.7);margin: 0 ;background:rgba(51,51,51,0.6);
  .index-boot-block{display: inline-block;width:18%; color:$mainColor2;text-align: center;font-size: 0.9rem;margin:0 2vw 1vw 3vw;}
  .index-boot-block:last-child{margin-right: 0;}
  .index-boot-span{font-size:2.2rem;display: block; margin-top: 1.2vw;}
}
.index-title{font-size: 1.05rem;margin:3vw 3vw 3vw 3.5vw;color: #666;}
.index-book{
  padding:0 0 0 3.5vw;margin-bottom: -5.5vw;word-break: keep-all;white-space: nowrap;overflow: auto;
  .index-book-block{margin:0 7.5vw 5vw 0;}
  //.index-book-block:nth-child(3n){margin-right:0;}
}
.index-article{padding-bottom: 2vw;margin:0 3.5vw 3.5vw 3.5vw;}
.index-article:last-child{margin-bottom: 8vw;}
.index-guali{padding: 0 3.5vw; color: #666; text-align: justify}


.index-base{padding-left: 3.5vw;}
.index-base-item{display:inline-block; width:20vw;background: $mainColor; margin-left:2vw;text-align: center;height:8vw;line-height: 8vw; margin-bottom: 2vw;border-radius: 1vw; font-size: 0.9rem;}

/*---------------首页 end----------------*/


/*--------------------排盘 start------------------*/
.paipan-body{background: $mainColor;color:$blackColor;}
.paipan-time{text-align: center;margin: 1vw 0 0.5vw 0;font-weight: bold; }
.paipan-gz{text-align: center;font-size: 1rem; font-weight: bold;}
.gua-block{
  display: flex;justify-content:space-between;color:$blackColor;margin:2vw 5vw 0 5vw;
  .gua{
    width:33%;text-align: center;
    .title{font-size: 1.1rem;font-weight: bold;}
    .title2{font-size: 0.9rem; font-weight: normal;}
    .hua{font-size:6.5rem;text-align: center;}
  }
}

.guayaochi{
  padding:0 5vw 0 5vw;
  .title{margin-left: -2.1vw;margin-top: 3vw;}
  .field{display: inline-block;width:12vw;vertical-align: top;}
  .fieldvalue{display: inline-block;width:77vw;text-align: justify;}
  .li{font-size: 0.9rem;}
}

.custom-gua{
  position: fixed;top:0;left:0;visibility:hidden;background: rgba(0,0,0,0);width:100vw;height:100vh;z-index: 10;transition: all 0.2s ease;
  .custom-gua-block{height:50vh;position:absolute;bottom:-1px;left:0;width:100vw;background: $mainColor;transition: transform 0.2s ease;transform:translate3d(0,100%,0);box-sizing: border-box;}
  .custom-title{margin:2vw 5vw 2vw 5vw;}
  .custom-sg,.custom-xg,.custom-dy{
    text-align:left;padding:0 5vw;
    .icon-gua{font-size:1.8rem;display: inline-block;color:#504732;margin-right: 0.5vw;}
    .icon-gua.on{color:#ff5400;}
  }
  .custom-gua-tools{padding:2vw; border-bottom:solid 1px #bca56b; text-align: right;}
  .custom-gua-btn{display: inline-block;}
}

.custom-gua.on{
  visibility:visible;background: rgba(0,0,0,0.5);
  .custom-gua-block{
    bottom:0;transform: translate3d(0,0,0);
  }
}
.paipan-btn-block{text-align: center;margin-top: 2vw; margin-bottom: 6vw;}
.paipan-btn{width:30vmin;height:9vw;line-height:9vw;padding:0 3vw;border:solid #bca56b 1px;display: inline-block;vertical-align: middle;font-size: 1rem;box-sizing: border-box;border-radius: 1vw;margin:0 1vw;}
/*--------------------排盘 end------------------*/





/*--------------------易学书籍 start------------------*/
.book-block{overflow: hidden;position: relative;z-index: 0;padding-top: 6vw;}
.book-list{
  width:30%;float:left;text-align: center;position: relative;padding-top:0;margin: 0 1.6%;padding-bottom: 3vw;
  //.book-img{width:25vw;border-radius: 1vw;height:35vw; margin-bottom: 1vw;}
  .book-title{text-align: center;overflow: hidden;font-size: 0.9rem; color:#666; line-height: 1.1;height: 0.95rem; margin-top: 1vw;}
}
//.book-list:after{display: block;height:3vw;background: #b6934f;content: "";border-radius: 1vw 1vw 0 0;}
.book-detail{color:#666;width:90vw;height:83.5vh;margin-left: 5vw;margin-top: 2vh; position:relative; overflow: auto;font-size: 1.1rem; line-height: 1.7;}

//目录
.book-dir{width: 100vw;height: 100vh;position: absolute;left:-100vw; top: 0; background: rgba(0,0,0,0.3);overflow: hidden;z-index: 11; }
.book-dir-block{width:60vw;height:100vh; background: $mainColor;position:absolute;left:100vw;top:0; box-sizing: border-box;padding-left: 8vw; transition: 0.3s all;}
.book-dir-title{font-size: 1.2rem;height:6vh;line-height:6vh;font-weight: bold; padding: 2vh 0 1vh 0;}
.book-dir-list{height: 87vh; overflow: auto; box-sizing: border-box;padding-bottom: 10vw;}
.book-dir-li{height:10vw;text-overflow: ellipsis; overflow: hidden;line-height: 10vw;word-wrap: break-word;}
.book-dir.on{
  left:0;
  .book-dir-block{left:40vw;}
}
.book-tools{color:#666;padding:2vw 5vw 0 5vw; font-size: 0.9rem;}
.book-tools:before{font-size: 1.5rem;  vertical-align: middle; margin-right: 0.5vw;}
/*--------------------易学书籍 end------------------*/

/*文章详情页面*/
.article-title,.article-title2{text-align: center;font-size: 1.2rem;color:$mainColor2;margin:8vw 0 4vw 0;padding: 0 5vmin;}
.article-title2{font-size: 0.8rem;margin:0 0 4vmin 0;color:$whiteColor;}
.article-content{font-size: 1rem;text-align: justify;line-height: 1.7;padding: 0 5vw 5vw 5vw;color:#666;}
.article-content img{max-width: 100%; margin: 0 auto;}

.about-content{
  color:#666;line-height: 1.5; padding:5vw; text-align: center;
  .qrcode{display:inline-block; margin-top: 15vw;}
  img{border:solid 2vw #fff; margin-bottom: 2vw;}
  .about-content-text{margin-botttom: 0; font-size:0.9rem;}
  .about-content-text2{font-size:0.9rem;text-align: left; margin: 5vw 3vw;}
}
.search{border-bottom: solid 1px rgba(51,51,51,0.7);background:rgba(51,51,51,0.6);color:#999;padding:0 2vw; margin:3vw 3vw 5vw 3vw;font-size: 1rem;color:#999;}
.search:before{font-size: 1.2rem; position: relative; display: inline-block;vertical-align: middle; margin-right: 1vw;}
.search-input{border:none;background: none;height:8vw; outline: none;color:#999;font-size: 0.95rem; position: relative;top:0.3vw;}

.book-detail .book-detail-icon:before{font-size: 1.5rem!important; vertical-align: middle; margin-right: 1vw;}

.book-info{
  padding:7vw 5vw 5vw 5vw;color:#666;
  .book-cover{width:29vw;height:41vw;}
  .book-cover-hr{width:3vw;}
  .book-cover-title{width:6.2vw; font-size: 0.85rem; margin: 1vw;}
  .book-info-item{float:right;color:#666;width:54vw; margin-bottom: 1vw;font-size: 0.9rem;}
  .book-info-title{font-size: 1.2rem;margin: 0 0 1vw 0; }
  .book-info-btn{width:28vw;height:8vw;text-align: center; display: inline-block;text-decoration: none;background: $mainColor;border-radius: 1vw; line-height: 8.5vw;font-size: 1rem;color:#333; overflow: hidden; margin-top:7vw;}
  .book-info-title2{margin-top: 4vw; font-size: 1.1rem;border-bottom: solid 1px #333; padding-bottom: 1vw;}
  .book-info-content{padding-top:3vw;line-height: 1.5;}

  .book-info-block{position: relative;}
  .book-info-item2{position: absolute;bottom:0;right:0; margin-bottom: 0;}
}

